<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">

    <head>
        <meta charset="utf-8" />
        <title></title>
        <link rel="stylesheet" type="text/css" href="css/global.css" />
        <link rel="stylesheet" type="text/css" href="css/gla.css" />
    </head>

    <body>
        <div id="frameHeader" class="frame-head">
            <div class="frame-logo">
                <a class="frame-logo-main" href="#">
                    <img src="images/logo_s.png" alt="蓝桥" />
                </a>
                <p class="frame-logo-sub">蓝桥</p>
            </div>
            <div class="frame-topbar">
				<ul class="frame-tools">
					<li>
						<p>欢迎: aaa</p>
					</li>
					<li>
						<a href="#">退出</a>
					</li>
				</ul>
            </div>
        </div>
        <div id="frameBody" class="frame-body">
            <div class="frame-menu">
                <a id="toggleMenuBtn" class="frame-menu-console iconfont icon-3line-x" href="javascript:;"></a>
                <div class="frame-menu-wrapper">
                    <dl class="frame-menu-item">
                        <dt class="frame-menu-mod">
							<a href="javascript:;">
								<div class="menu-icon iconfont icon-caret"></div>
								<p class="menu-text">通用设置</p>
							</a>
						</dt>
                        <dd class="frame-menu-sub">
                            <a href="#">
                                <div class="menu-icon iconfont icon-members"></div>
                                <p class="menu-text">用户</p>
                            </a>
                        </dd>
                        <dd class="frame-menu-sub frame-menu-active">
                            <a href="#">
                                <div class="menu-icon iconfont icon-shop"></div>
                                <p class="menu-text">企业</p>
                            </a>
                        </dd>
                        <dd class="frame-menu-sub">
                            <a href="#">
                                <div class="menu-icon iconfont icon-reviewing"></div>
                                <p class="menu-text">商家</p>
                            </a>
                        </dd>
                        <dd class="frame-menu-sub">
                            <a href="#">
                                <div class="menu-icon iconfont icon-members"></div>
                                <p class="menu-text">信息</p>
                            </a>
                        </dd>
                        <dd class="frame-menu-sub">
                            <a href="#">
                                <div class="menu-icon iconfont icon-3line-x"></div>
                                <p class="menu-text">用户组</p>
                            </a>
                        </dd>
                        <dd class="frame-menu-sub">
                            <a href="#">
                                <div class="menu-icon iconfont icon-3line-x"></div>
                                <p class="menu-text">财务</p>
                            </a>
                        </dd>
                    </dl>
                    <dl class="frame-menu-item">
                        <dt class="frame-menu-mod">
							<a href="javascript:;">
								<div class="menu-icon iconfont icon-caret"></div>
								<p class="menu-text">信用卡</p>
							</a>
						</dt>
                        <dd class="frame-menu-sub">
                            <a href="#">
                                <div class="menu-icon iconfont icon-members"></div>
                                <p class="menu-text">分期</p>
                            </a>
                        </dd>
                        <dd class="frame-menu-sub">
                            <a href="#">
                                <div class="menu-icon iconfont icon-reviewing"></div>
                                <p class="menu-text">账单</p>
                            </a>
                        </dd>
                        <dd class="frame-menu-sub">
                            <a href="#">
                                <div class="menu-icon iconfont icon-3line-x"></div>
                                <p class="menu-text">授权</p>
                            </a>
                        </dd>
                    </dl>
                </div>
            </div>
            <div class="frame-wrapper">
                <div class="frame-msub" id="frameMsub">
                    <a class="frame-msub-toggle" id="frameMsubToggle" href="javascript:;">
                        <span class="iconfont icon-3line-x"></span>
                    </a>
                    <div class="frame-msub-hd">
                        <h4 class="msub-title"><span class="iconfont icon-setting"></span>商户管理</h4>
                    </div>
                    <div class="frame-msub-bd">
                        <ul class="frame-msub-items">
                            <li>
                                <a href="#"><span class="iconfont icon-parameter"></span>商家列表</a>
                            </li>
                            <li class="msub-current">
                                <a href="#"><span class="iconfont icon-liuliang"></span>商家表</a>
                            </li>
                            <li>
                                <a href="#"><span class="iconfont icon-payitem"></span>商家列表列表列表</a>
                            </li>
                            <li>
                                <a href="#"><span class="iconfont icon-account"></span>商家列表(11)</a>
                            </li>
                            <li>
                                <a href="#"><span class="iconfont icon-advert"></span>水电费是否收到</a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="frame-page">
                    <div class="frame-main">
                        <div class="frame-main-hd">
                            <h3 class="frame-title">页面标题</h3>
                        </div>
                        <div class="frame-main-bd">
                            <p class="glb-tips glb-tips-qt glb-tips-alert">激励拖拉机就开始考虑到河南省开封的</p>
                            <ul class="glb-steps glb-stepbar glb-steps-col4">
                                <li>
                                    <p class="step-text">1. 注册账号</p>
                                </li>
                                <li class="step-current">
                                    <p class="step-text">2. 账号验证</p>
                                </li>
                                <li>
                                    <p class="step-text">3. 注册成功,等待审核</p>
                                </li>
                                <li>
                                    <p class="step-text">4. 申请成功</p>
                                </li>
                            </ul>

                            <div class="form-body">
                                <form id="demoForm" action="">
                                    <div class="glb-col-p60">
                                        <div class="form-item">
                                            <h6 class="form-label">用户名:</h6>
                                            <div class="form-entity">
                                                <div class="form-field">
                                                    <input class="form-ipt" type="text" name="f5" value="" placeholder="请输入用户名" />
                                                </div>
                                            </div>
                                            <div class="form-caption">
                                                <h6>1. 内容简介本书分为上学期和下学期两部分</h6>
                                                <h6>2. 主要内容包括：<span class="form-text-em">写校</span>园一处景物；</h6>
                                                <h6>3. 是2012年西安出版社出版的一本图书</h6>
                                            </div>
                                        </div>
                                        <div class="form-item">
                                            <h6 class="form-label">下拉框:</h6>
                                            <div class="form-entity">
                                                <div class="form-field">
                                                    <select name="f6" class="form-sel">
                                                        <option value="">请选择项目</option>
                                                        <option value="">请选择项目</option>
                                                        <option value="">请选择项目</option>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-item">
                                            <h6 class="form-label">开关选项 :</h6>
                                            <div class="form-entity">
                                                <div class="form-field">
                                                    <dl class="form-inline glb-selector">
                                                        <dd>
                                                            <a class="option" href="javascript:;">
                                                                <h6>短信认证</h6>
                                                                <input class="form-cb" type="checkbox" name="f11" value="" />
                                                            </a>
                                                        </dd>
                                                        <dd class="on">
                                                            <a class="option" href="javascript:;">
                                                                <h6>邮件认证</h6>
                                                                <input class="form-cb" type="checkbox" name="f11" value="" />
                                                            </a>
                                                        </dd>
                                                    </dl>
                                                    <div class="form-inline">
                                                        <input class="form-ipt glb-col-w100" type="text" name="f12" value="" placeholder="短信码(6位以内)" />
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-item">
                                            <h6 class="form-label">设置 :</h6>
                                            <div class="form-entity">
                                                <div class="form-field">
                                                    <div class="form-inline form-ipt-group">
                                                        <input class="form-ipt glb-col-w40" type="text" name="f21" value="" placeholder="折扣(10位以内)" />
                                                        <span class="ipt-addon">%</span>
                                                    </div>
                                                    <div class="form-inline">
                                                        <a id="showDialog" href="javascript:;" class="glb-button glb-btn-primary">选择</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-item">
                                            <h6 class="form-label">图标选择 :</h6>
                                            <div class="form-entity">
                                                <div class="form-field">
                                                    <p class="form-text form-text-cap">已选择[移动][联通][电信]</p>
                                                    <dl class="glb-selector glb-selector-ico glb-selector-blk" data-max="3">
                                                        <dd>
                                                            <a class="option" href="javascript:;">
                                                                <p class="ico-block iconfont icon-cmcc"></p>
                                                                <h4 class="ico-text">移动</h4>
                                                                <input class="form-cb" type="checkbox" name="f31" value="" />
                                                            </a>
                                                        </dd>
                                                        <dd>
                                                            <a class="option" href="javascript:;">
                                                                <p class="ico-block iconfont icon-cucc"></p>
                                                                <h4 class="ico-text">联通</h4>
                                                                <input class="form-cb" type="checkbox" name="f31" value="" />
                                                            </a>
                                                        </dd>
                                                        <dd class="on">
                                                            <a class="option" href="javascript:;">
                                                                <p class="ico-block iconfont icon-ctcc"></p>
                                                                <h4 class="ico-text">电信</h4>
                                                                <input class="form-cb" type="checkbox" name="f31" value="" />
                                                            </a>
                                                        </dd>
                                                    </dl>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-item">
                                            <h6 class="form-label">多项输入:</h6>
                                            <div class="form-entity">
                                                <div class="form-field">
                                                    <dl class="form-inline glb-selector">
                                                        <dd>
                                                            <a class="option" href="javascript:;">
                                                                <h6>无</h6>
                                                                <input class="form-cb" type="checkbox" name="f41" value="" />
                                                            </a>
                                                        </dd>
                                                        <dd class="on">
                                                            <a class="option" href="javascript:;">
                                                                <h6>有</h6>
                                                                <input class="form-cb" type="checkbox" name="f41" value="" />
                                                            </a>
                                                        </dd>
                                                    </dl>
                                                    <div class="form-inline form-ipt-group">
                                                        <input class="form-ipt glb-col-w60" type="text" name="f42" value="" placeholder="数量" />
                                                        <span class="ipt-addon">个</span>
                                                    </div>
                                                    <div class="form-inline form-ipt-group">
                                                        <input class="form-ipt glb-col-w60" type="text" name="f43" value="" placeholder="价格" />
                                                        <span class="ipt-addon">元</span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-item">
                                            <h6 class="form-label">多选项设置 :</h6>
                                            <div class="form-entity">
                                                <div class="form-field">
                                                    <div class="form-line">
                                                        <dl class="glb-selector">
                                                            <dd>
                                                                <a class="option" href="javascript:;">
                                                                    <h6>无</h6>
                                                                    <input class="form-cb" type="checkbox" name="f71" value="" />
                                                                </a>
                                                            </dd>
                                                            <dd>
                                                                <a class="option" href="javascript:;">
                                                                    <h6>国内</h6>
                                                                    <input class="form-cb" type="checkbox" name="f71" value="" />
                                                                </a>
                                                            </dd>
                                                            <dd class="on">
                                                                <a class="option" href="javascript:;">
                                                                    <h6>港澳台</h6>
                                                                    <input class="form-cb" type="checkbox" name="f71" value="" />
                                                                </a>
                                                            </dd>
                                                            <dd>
                                                                <a class="option" href="javascript:;">
                                                                    <h6>亚洲</h6>
                                                                    <input class="form-cb" type="checkbox" name="f71" value="" />
                                                                </a>
                                                            </dd>
                                                            <dd>
                                                                <a class="option" href="javascript:;">
                                                                    <h6>欧美</h6>
                                                                    <input class="form-cb" type="checkbox" name="f71" value="" />
                                                                </a>
                                                            </dd>
                                                        </dl>
                                                    </div>
                                                    <div class="form-line form-line-sub">
                                                        <dl class="form-inline glb-selector">
                                                            <dd class="on">
                                                                <a class="option" href="javascript:;">
                                                                    <span class="ico-inline iconfont icon-cmcc"></span>移动
                                                                </a>
                                                            </dd>
                                                        </dl>
                                                        <div class="form-inline form-ipt-group">
                                                            <input class="form-ipt glb-col-w60" type="text" name="f73" value="" placeholder="话费余额" />
                                                            <span class="ipt-addon">元</span>
                                                        </div>
                                                        <div class="form-inline">
                                                            <p class="form-text form-text-cap">当前剩余<span class="form-text-em">200元</span>
                                                                <a class="form-text-link" href="#">立即购买</a>
                                                            </p>
                                                        </div>
                                                    </div>
                                                    <div class="form-line form-line-sub">
                                                        <dl class="form-inline glb-selector">
                                                            <dd class="on">
                                                                <a class="option" href="javascript:;">
                                                                    <span class="ico-inline iconfont icon-cucc"></span>联通
                                                                </a>
                                                            </dd>
                                                        </dl>
                                                        <div class="form-inline form-ipt-group">
                                                            <input class="form-ipt glb-col-w60" type="text" name="f74" value="" placeholder="话费余额" />
                                                            <span class="ipt-addon">元</span>
                                                        </div>
                                                        <div class="form-inline">
                                                            <p class="form-text form-text-cap">当前剩余<span class="form-text-em">100元</span>
                                                                <a class="form-text-link" href="#">立即购买</a>
                                                            </p>
                                                        </div>
                                                    </div>
                                                    <div class="form-line form-line-sub">
                                                        <dl class="form-inline glb-selector">
                                                            <dd class="on">
                                                                <a class="option" href="javascript:;">
                                                                    <span class="ico-inline iconfont icon-ctcc"></span>电信
                                                                </a>
                                                            </dd>
                                                        </dl>
                                                        <div class="form-inline form-ipt-group">
                                                            <input class="form-ipt glb-col-w60" type="text" name="f75" value="" placeholder="话费余额" />
                                                            <span class="ipt-addon">元</span>
                                                        </div>
                                                        <div class="form-inline">
                                                            <p class="form-text form-text-cap">当前剩余<span class="form-text-em">300元</span>
                                                                <a class="form-text-link" href="#">立即购买</a>
                                                            </p>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-action clearfix">
                                            <a id="validateBtn" class="glb-button glb-btn-default" href="javascript:;">点击查看校验效果</a>
                                            <a id="submitBtn" class="glb-button glb-btn-primary" href="javascript:;">
                                                <span>点击弹出对话框</span>
                                            </a>
                                        </div>
                                    </div>
                                    <div class="glb-col-p40">
                                        <div class="form-item form-item-qt">
                                            <h6 class="form-label">企业证件照 :</h6>
                                            <div class="form-entity">
                                                <div class="form-field">
                                                    <div class="form-inline">
                                                        <a href="javascript:;" class="form-line-sub glb-button glb-btn-default">点击上传企业证件照</a>
                                                        <a href="#" class="glb-preview" target="_blank">
                                                            <img src="http://r4.ykimg.com/05140000576CA32E67BC3C13B50E4C6F" alt="" />
                                                        </a>
                                                    </div>
                                                    <div class="form-inline">
                                                        <a href="javascript:;" class="form-line-sub glb-button glb-btn-default">点击上传企业证件照</a>
                                                        <a href="#" class="glb-preview" target="_blank">
                                                            <img src="images/no_img.png" alt="" />
                                                        </a>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-caption">
                                                <h6>1. 内容简介本书分为上学期和下学期两部分</h6>
                                                <h6>2. 主要内容包括：<span class="form-text-em">写校</span>园一处景物；</h6>
                                                <h6>3. 是2012年西安出版社出版的一本图书</h6>
                                            </div>
                                        </div>
                                        <div class="form-item form-item-qt">
                                            <h6 class="form-label">企业证件照 :</h6>
                                            <div class="form-entity">
                                                <div class="form-field">
                                                    <textarea class="form-ta" name="name-c1" rows="" cols=""></textarea>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>

    </body>

    <script type="text/javascript" src="js/jquery.min.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/global.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/dialog.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/validate.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/gla.js" charset="utf-8"></script>
    <script type="text/javascript">
        $(function() {

            Frame.showSuccess();
            window.setTimeout(function() {
                Frame.showError();
            }, 1000)

            $("#showDialog").click(function() {

                Dialogx.show({
                    _url: 'dialog.html',
                    _title: '请输入充值金额'
                });

            });

            $("#submitBtn").click(function() {

                Dialogx.confirm('这是一个提示框', function() {
                    $("#demoForm").submit();
                });

            });

            $("#validateBtn").click(function() {

                    $("#demoForm").submit();

            });
            // VALIDATE
            $("#demoForm").validate(rules);

        });

        // form validate rule
        var rules = {

            "f11": {
                tip: "这里是提示信息",
                rule: {
                    required: ["表单为空提示信息"]
                }
            },

            "f12": {
                tip: "这里是提示信息",
                rule: {
                    required: ["表单为空提示信息"],
                    length: ["长度为4-20位提示信息", "4-20"]
                }
            },

            "f21": {
                tip: "这里是提示信息",
                rule: {
                    required: ["表单为空提示信息"],
                    length: ["长度为4-20位提示信息", "4-20"]
                }
            },

            "f31": {
                tip: "这里是提示信息",
                rule: {
                    required: ["表单为空提示信息"]
                }
            },

            "f41": {
                tip: "这里是提示信息",
                rule: {
                    required: ["表单为空提示信息"]
                }

            },

            "f42": {
                tip: "这里是数量提示信息",
                rule: {
                    required: ["数量为空提示信息"],
                    length: ["长度为4-20位提示信息", "4-20"]
                }
            },

            "f43": {
                tip: "这里是价钱信息",
                rule: {
                    required: ["价钱为空提示信息"],
                    length: ["价钱为4-20位提示信息", "4-20"]
                }
            },

            "f5": {
                tip: "这里是用户名提示信息",
                rule: {
                    required: ["用户名不能为空"],
                    length: ["长度为4-20位提示信息", "4-20"],
                    email: ["必须是邮件格式"]
                }
            },

            "f6": {
                tip: "下拉框无提示信息",
                rule: {
                    required: ["下拉框不能为空"]
                }
            },

            "f71": {
                tip: "选项提示信息",
                rule: {
                    required: ["选项为空提示信息"]
                }
            },

            "f73": {
                tip: "这里是价钱信息",
                rule: {
                    required: ["价钱为空提示信息"],
                    length: ["价钱为4-20位提示信息", "4-20"]
                }
            },

            "f74": {
                tip: "这里是价钱信息",
                rule: {
                    required: ["价钱为空提示信息"],
                    length: ["价钱为4-20位提示信息", "4-20"]
                }
            },

            "f75": {
                tip: "这里是价钱信息",
                rule: {
                    required: ["价钱为空提示信息"],
                    length: ["价钱为4-20位提示信息", "4-20"]
                }
            }

        };
    </script>

</html>